<template>
	<view class="">
		<s-pull-scroll ref="pullScroll" :pullDown="pullDown" :pullUp="loadData" :back-top="true" :footerHeight="60">
			<view class="" style="padding: 20rpx;">
				<view class="item-con" v-for="(item, index) in dataList" :key="index" @click.stop="itemOnClick(item,index)">
					<view class="list-item flex-row section_7">
						<view class="right-group fill">
							<view class="flex-row items-center justify-between">
								<view class="text_5 clamp">车牌号 : {{item.name}}{{item.name1}}{{item.name2}}</view>
								<view class="item-btn" v-if="item.isDefult==0">默认</view>
								<u-icon name="arrow-right" size="24" color="#999999" @click.stop="edmit(item,index)"></u-icon>
							</view>
							<view class="center-group text_7 clamp">{{item.type}} I {{item.license}}</view>
							 <view class="flex-row justify-between items-center">
								<view class="">
				
								</view>
						
							</view> 
						</view>
					</view>
				</view>
			</view>
		</s-pull-scroll>
         <mix-loading v-if="isLoading"></mix-loading>
		<view class="btn-con" v-if="dataList.length == 0"><view class="btn" hover-class="hover-opacity" @click="navTo('./addCart')">添加爱车</view></view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			dataList: [],
			souce:0
		};
	},
	onLoad(options) {
		if(options.souce) this.souce=options.souce;
		if(options.id) this.id=options.id;
		uni.$on('change',(item)=>{
			if(this.souce==1 && this.id==item.id){
				setTimeout(()=>{
					this.$util.prePage().setCartItem(item);
				},800)
			}
		})
		uni.$on('del',(id)=>{
			if(this.souce==1 && this.id==id){
				setTimeout(()=>{
					this.$util.prePage().setCartItem({});
				},800)
			}
		})
	},
	onShow() {
		this.refresh();
	},
	methods: {
		pullDown(pullScroll) {
			setTimeout(() => {
				this.loadData(pullScroll);
			}, 200);
		},
		async loadData(pullScroll) {
			const data = {
				uid: uni.getStorageSync('uid'),
				pageNo: pullScroll.page,
				pageSize: '10'
			};
			if (pullScroll.page == 1) this.dataList = [];
			const res = await this.$request('user/my-car-list', data, { showLoading: true });
			if (res.result == 0) {
				this.dataList =res.data;
				pullScroll.endByPage(1, res.data);
			} else {
				this.$util.msg(res.resultNote);
			}
		},
		edmit(item,index){
			getApp().globalData.cartInfo=item; 
			this.navTo('/pages/myself/addCart?type=1');
		},
		itemOnClick(item,index){
			if(this.souce==1){
				this.$util.prePage().setCartItem(item);
				this.back();
			}
		}
	}
};
</script>

<style scoped lang="scss">
body, page, .uni-page {
	background: #f7f8fa !important;
}
.btn-con {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	padding: 20rpx 0 30rpx 0;
	width: 100vw;
	background: transparent;
	display: flex;
	justify-content: center;
	z-index: 10;
}
.btn {
	width: 90vw;
	max-width: 704rpx;
	height: 88rpx;
	line-height: 88rpx;
	text-align: center;
	background: #ff710b;
	border-radius: 44rpx;
	font-size: 32rpx;
	font-weight: bold;
	color: #ffffff;
	margin: 0 auto;
	box-shadow: 0 4rpx 16rpx 0 rgba(255,113,11,0.10);
	letter-spacing: 2rpx;
	display: flex;
	align-items: center;
	justify-content: center;
}
.item-con {
	padding: 0;
	margin: 0 0 32rpx 0;
	background: transparent;
	box-shadow: none;
}
.list-item {
	display: flex;
	align-items: center;
	background: #fff;
	border-radius: 20rpx;
	box-shadow: 0 6rpx 32rpx 0 rgba(0,0,0,0.08);
	padding: 32rpx 28rpx;
	margin: 0 20rpx;
	transition: box-shadow 0.2s;
	border: none;
}
.list-item:active {
	box-shadow: 0 12rpx 40rpx 0 rgba(0,0,0,0.12);
}
.image_9 {
	width: 96rpx;
	height: 96rpx;
	border-radius: 16rpx;
	background: #f3f3f3;
	object-fit: cover;
	margin-right: 28rpx;
}
.right-group {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-width: 0;
}
.text_5 {
	color: #222;
	font-size: 30rpx;
	font-weight: bold;
	margin-bottom: 12rpx;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.center-group {
	font-size: 24rpx;
	color: #999;
	margin-bottom: 0;
}
.text_7 {
	font-size: 26rpx;
	color: #666;
	font-weight: 500;
}
.text_11 {
	color: #bbb;
	font-size: 22rpx;
	margin-right: 18rpx;
}
.item-btn {
	width: 66rpx;
	height: 36rpx;
	text-align: center;
	line-height: 36rpx;
	background: #ff710b;
	border-radius: 18rpx;
	font-size: 20rpx;
	font-weight: 500;
	color: #fff;
	margin-left: 12rpx;
}
.u-icon {
	margin-left: 18rpx;
	font-size: 36rpx !important;
}
.s-pull-scroll {
	min-height: 70vh;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.s-pull-scroll image,
.s-pull-scroll .empty-img {
	width: 120rpx;
	height: 120rpx;
	margin: 80rpx auto 20rpx auto;
	display: block;
}
.s-pull-scroll .empty-text {
	text-align: center;
	color: #bbb;
	font-size: 28rpx;
	margin-bottom: 40rpx;
}
</style>
